{% extends 'home.html' %}

{% block title %}
    <title>账号信息查找</title>
{% endblock %}

{% block custom_css %}

    <link href="/static/sweetalert/sweetalert.css" rel="stylesheet">
    <link href="/static/switch/bootstrap-switch.min.css" rel="stylesheet">
    <link href="/static/css/jquery.resizableColumns.css" rel="stylesheet">
    <link href="/static/contextMenu/jquery.contextMenu.css" rel="stylesheet"/>
    <link rel="stylesheet" href="/static/zTreeStyle/zTreeStyle.css" type="text/css">
    <link rel="stylesheet" href="/static/select2/select2.min.css" type="text/css">

    <style>
        .table>thead>tr{
            background: #edf7ff;
        }
    </style>

    <!--template css-->
{% endblock %}

{% block content %}
    <div class="page-header">
        <div class="row">
            <div class="col-sm-6">
                <h4>账号过期时间查询</h4>
            </div>
        </div>
    </div>
    <div class="row">
        <div class="col-sm-12" >
            <div class="panel-group accordion">
                <div class="panel panel-default">
                    <div class="panel-heading">
                        <span aria-hidden="true" class="fa fa-search"></span>
                        查找
                    </div>
                    <div id="collapseOne" class="panel-collapse collapse in">
                        <div class="panel-body">
                            <div class="form-horizontal"  >
                                <div class="form-group" id="changeradio">
                                    <label  class="col-sm-2 col-sm-offset-1 control-label" style="margin-top: 20px">是否通知过期时间账号:</label>
                                    <div class="col-lg-6" style="margin-top: 5px">
                                        <label> <input type="radio"  value="" checked name="check"> <i></i>不通知 </label>
                                        <label style="margin: 20px"> <input type="radio" value="True" name="check"> <i></i> 通知 </label>
                                    </div>
                                </div>
                                <div class="form-group" style="margin-top: 30px">
                                    <label class="col-sm-2 col-sm-offset-1 control-label" style="margin-top: 5px">过期时间:</label>
                                    <div class="col-sm-6">
                                        <div class="input-group">
                                            <input type="text" placeholder="请输入需要查询的过期日期" id="inttime" class="form-control">
                                            <span class="input-group-btn">
                                                <button type="button" class="btn btn-default" onclick="searchpastime()">查找</button>
                                            </span>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <hr>
                    <div id="startpwdchange">
                        <hr>
                        <div class="panel-heading">
                            <h4>搜索结果(S)<sub><span id="counts" style="color: #bb0000"></span></sub></h4>
                        </div>
                        <div>
                            <div class="panel-body " id="paneltable" style="padding:0;padding-left: 80px;padding-right: 80px">
                                <table class="table table-hover table-bordered"  id="table">
                                    <thead>
                                    <tr>
                                        <th class="table-bordered" data-resizable-column-id="name" style="width: 150px">账号</th>
                                        <th class="table-bordered" data-resizable-column-id="name" >显示名称</th>
                                        <th class="table-bordered" data-resizable-column-id="first_name">过期时间</th>
                                        <th class="table-bordered" data-resizable-column-id="last_name">邮箱地址</th>
                                    </tr>
                                    </thead>
                                    <tbody id="searchpwduser">
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
{% endblock %}

{% block custom_js %}
    <script src="/static/sweetalert/sweetalert.min.js"></script>
    <script src="/static/switch/bootstrap-switch.min.js"></script>
    <script src="/static/js/store.js"></script>
    <script src="/static/js/jquery.resizableColumns.min.js"></script>
    <script src="/static/js/jquery.contextMenu.min.js"></script>
    <script type="text/javascript" src="/static/zTreeStyle/jquery.ztree.all.min.js"></script>
    <script src="/static/select2/select2.full.min.js"></script>
    <script src="/static/select2/zh-CN.js"></script>

    <script>
        $(function(){
            $('#startpwdchange').hide();
        });
        function searchpastime() {

            val=$('input:radio[name="check"]:checked').val();
            inttime = document.getElementById("inttime").value;
            if (inttime){
                var bh = $("body").height();
                var bw = $("body").width();
                $("#fullbg").css({
                    height: bh+20,
                    width: bw,
                    display: "block"
                });
                $("#dialoga").show();
                $.ajax({
                    url:'{% url "api:GetPasswordDate" %}',
                    {#url:"/api/AddUserToGroup/" ,#}
                    type:'POST',
                    dataType:'json',
                    traditional:true,
                    data:{"Notice":val,"ExpDate":inttime},
                    success:function (data) {
                        $("#startpwdchange").show();
                        $("#searchpwduser").html('');
                        if (data['isSuccess']) {
                            if(data['message'].length){
                                for (i = 0; i < data['message'].length; i++) {
                                    newRow = "<tr ><td>"+fixXss(data['message'][i]['sAMAccountName'])+"</td><td>"+fixXss(data['message'][i]['displayName'])+"</td><td>"+data['message'][i]['passwordtime']+"</td><td>"+data['message'][i]['mail']+"</td></tr>"
                                    $("#searchpwduser").append(newRow);
                                }
                            }
                            else {
                                newRow="<tr><td colspan='4'>未查询到账号信息</td></tr>";
                                $("#searchpwduser").append(newRow);
                            }
                        }
                        else {
                            swal(data['message'])
                        }
                        $("#fullbg,#dialoga").hide();
                    }
                })
            }
            else {
                swal('请输入时间')
            }
        }
    </script>
{% endblock %}